import * as vscode from 'vscode';

export class HiLogViewProvider implements vscode.WebviewViewProvider {
    public static readonly viewType = 'hiLogView';

    constructor(private readonly _extensionUri: vscode.Uri) {}

    resolveWebviewView(
        webviewView: vscode.WebviewView,
        context: vscode.WebviewViewResolveContext,
        _token: vscode.CancellationToken
    ) {
        // Create or show the HiLog Panel when the view is resolved
        webviewView.webview.options = {
            enableScripts: true,
            localResourceRoots: [vscode.Uri.joinPath(this._extensionUri, 'media')]
        };

        // Add a button in the webview that opens the HiLog panel
        webviewView.webview.html = this.getHtmlForWebview();
    }

    private getHtmlForWebview() {
        return `<!DOCTYPE html>
        <html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>HiLog</title>
            <style>
                body {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    padding: 16px;
                }
                button {
                    background-color: var(--vscode-button-background);
                    color: var(--vscode-button-foreground);
                    border: none;
                    padding: 8px 16px;
                    border-radius: 2px;
                    cursor: pointer;
                    margin-top: 16px;
                    font-size: 13px;
                }
                button:hover {
                    background-color: var(--vscode-button-hoverBackground);
                }
                .description {
                    margin-bottom: 16px;
                    text-align: center;
                    font-size: 13px;
                }
            </style>
        </head>
        <body>
            <div class="description">
                Click the button below to open the HiLog panel
            </div>
            <button id="showHiLog">Show HiLog</button>
            
            <script>
                const vscode = acquireVsCodeApi();
                document.getElementById('showHiLog').addEventListener('click', () => {
                    vscode.postMessage({
                        command: 'showHiLog'
                    });
                });
            </script>
        </body>
        </html>`;
    }
} 